<!doctype html>
<html>
<head>
	<meta charset="UTF-8">
	<title>{$Think.lang.performance}</title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<link href="INDEX/css/mui.min.css" rel="stylesheet" />
	<link rel="stylesheet" type="text/css" href="INDEX/css/main.css"/>
	<link rel="stylesheet" type="text/css" href="INDEX/css/achievement.css?v=<?php echo time();?>"/>
</head>
<style>
	.table_box {
		overflow-x:scroll;
		display: -webkit-box;
		white-space: nowrap;
		overflow: hidden;
		overflow-x: scroll; /* 1 */
		-webkit-backface-visibility: hidden;
		-webkit-overflow-scrolling: touch; /* 2 */
		text-align: justify; /* 3 */
	}
	.mui-plus-pullrefresh .history_table .mui-scroll {
		position: absolute;
	}
	.more_history {
		 text-align: center;
		padding: 0.5em;
	}
   .mui-switch{
      		width:36px;
        	height:18px;
      }
      header div{
      		top : 30%;
      }
      .mui-switch .mui-switch-handle{
      		width:20px;
        	height:20px;
        left:-4px;
        top: -3px;
      }
      .mui-switch.mui-active:before{
      	top:-3px;
        left:1px;
      }
      .mui-switch.mui-active .mui-switch-handle {
    	-webkit-transform: translate(43px,0);
    	transform: translate(20px,0);
		}
      .mui-switch:before{
      		top:-3px;
        	left:15px;
      }
</style>
<body>
<script src="INDEX/js/mui.min.js"></script>

<header class="mui-bar mui-bar-nav">
	<a href="#offCanvasSide" class="right_top"></a>
	<!--<a class="mui-switch "></a>-->
	<div class="mui-switch mui-pull-right {if $think_var=='zh-cn'}mui-active{/if}">
		<div class="mui-switch-handle"></div>
	</div>
	<h1 class="mui-title">{$Think.lang.project_title}</h1>
</header>
<div id="offCanvasWrapper" style="overflow: hidden;" class="mui-off-canvas-wrap mui-slide-in">
	<div id="header">{include file='header'/}</div>
	<div class="mui-inner-wrap">
		<div id="offCanvasContentScroll" class="mui-content mui-scroll-wrapper mui-slide-in">
			<div class="mui-scroll">
				<div class="achievement_content">
					<div class="achievement_top">
						<div class="content_table">
							<div class="total_day">
								<div class="achievement_total">
									<div>{$Think.lang.performance_all}</div>
									<div class="achievement_total_num" style="color: #DE2B2F;">${$sysData.all_performance}</div>
								</div>
								<div class="achievement_day">
									<div>{$Think.lang.performance_day}</div>
									<div class="achievement_day_num" style="color: #DE2B2F;">${$sysData.day_performance}</div>
								</div>
							</div>
							<div class="month_year">
								<div class="achievement_month">
									<div>{$Think.lang.performance_month}</div>
									<div class="achievement_month_num" style="color: #DE2B2F;">${$sysData.month_performance}</div>
								</div>
								<div class="achievement_year">
									<div>{$Think.lang.performance_year}</div>
									<div class="achievement_year_num" style="color: #DE2B2F;">${$sysData.year_performance}</div>
								</div>
							</div>
						</div>
					</div>

					<div class="achievement_middle">
						<div class="cash_history">
							<div class="cash_history_title">{$Think.lang.performance_list_show}</div>
							<div class="history_table" id="tablescorll">
								<div class="table_box">
									<table  border="" cellspacing="5" cellpadding="5" rules="none">
										<tbody id="tabody">
										<tr>
											<th >{$Think.lang.member}</th>
											<th >{$Think.lang.performance_money}</th>
											<th >{$Think.lang.performance_percent}</th>
											<th >{$Think.lang.principal}</th>
											<th >{$Think.lang.give_out_date}</th>
										</tr>
										</tbody>
									</table>
								</div>
								<div class="more_history">{$Think.lang.put_load_more}</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

</body>
<script type="text/javascript">
    mui('#offCanvasSideScroll').scroll();
	mui('#offCanvasContentScroll').scroll();
	var more=document.getElementsByClassName("more_history")[0];
	more.addEventListener("tap", function () {
		pullfreshfunction();
	});
	var pageStart = 1;//开始数据条数
	pullfreshfunction();
	function pullfreshfunction() {
		var __self=this;
		var url = "{:Url('financial/financial_list')}";
		var page = pageStart;
		var str="";
		mui.ajax({
			type: "post",
			url: url,
			timeout: 10000,
			data: {
				page: page
			},
			dataType: "json",
			success: function (data) {
				if (data.code == 0) {
					var list = data.data;
					for (i in list) {
						str+= "<tr>"+
								"<td>"+list[i].user_name+"</td>"+
								"<td>$"+list[i].money+"</td>"+
								"<td>"+list[i].percent+"%</td>"+
								"<td>"+list[i].principal+"</td>"+
								"<td>"+list[i].create_time+"</td>"+
								"</tr>";
					}
					document.getElementById("tabody").innerHTML+=str;
					pageStart++;
				}else{
					mui.toast(data.message);
				}
			},
			error: function (XMLHttpRequest, textStatus, errorThrown) {
				console.log("请求失败!!！" + textStatus);
			}
		});

	}
</script>

</html>